<template>
	<view class="box">
		<view class="image">
			<image :src="userinfo.icon"></image>
		</view>
		<view class="info">
			<view class="text1">{{userinfo.name}}</view>
			<view class="text2">{{userinfo.firm}}<image src="../../static/yes.jpg"></image></view>
			<view class="text3">{{userinfo.spot}}</view>
		</view>
	</view>
</template>

<script setup>
	const props = defineProps({
		userinfo: {
			type:Object
		}
	})
	
</script>

<style lang="scss" scoped>
	.box{
		margin-top: 30rpx;
		display: flex;
		.image{
			// background-color: red;
			width: 157rpx;
			height: 157rpx;
			border-radius: 50%;
			margin: 30rpx;
			image{
				width: 158rpx;
				height: 158rpx;
				border-radius: 50%;
			}
		}
		.info{
			// background-color: yellow;
			width: 500rpx;
			height: 157rpx;
			margin-top: 30rpx;
			view{
				margin: 5rpx;
			}
			.text1{
				font-size: 35rpx;
				font-weight: bold;
			}
			.text2{
				font-size: 30rpx;
				image{
					width: 30rpx;
					height: 30rpx;
					border-radius: 50%;
				}
			}
			.text3{
				font-size: 30rpx;
				color: #999;
			}
		}
	}
</style>